<template>
        <form @submit.prevent="submitForm">
            <div>
                <label for="name">姓名：</label>
                <input type="text" id="name" v-model="userInfo.name" placeholder="请输入姓名" />
            </div>
            <div>
                <label for="email">邮箱：</label>
                <input type="email" id="email" v-model="userInfo.email" placeholder="请输入邮箱" />
            </div>
            <div>
                <label for="age">年龄：</label>
                <input type="number" id="age" v-model="userInfo.age" placeholder="请输入年龄" />
            </div>
            <button type="submit">提交</button>

        </form>
</template>

<script>
import { ref } from 'vue'
export default {
    setup () {
        const userInfo = ref(
            { name: '', email: '', age: null }
        );
        const submitForm = () => {
            console.log(userInfo.value)
        }
        return { userInfo, submitForm }
    }
}
</script>

<style lang="scss" scoped>

</style>